<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/views/pagelet/page-includes.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
	name="viewport">
</head>
<body class="hold-transition skin-blue sidebar-mini">
	<div class="wrapper">
		<%@ include file="/WEB-INF/views/pagelet/top.jsp"%>
		<%@ include file="/WEB-INF/views/pagelet/left.jsp"%>
		<div class="content-wrapper">
			<%@ include file="/WEB-INF/views/pagelet/content-header.jsp"%>
			<section class="content">
<!-- 内容开始 -->

				<div>
					<div class="box-body">
						<div class="row rowStyle">
							<div class="col-xs-3 bs-valid">
								<label for="orgName">机构名称: </label>
								<input type="text" class="form-control" onclick="showMenu('orgName');" id="orgName" name="orgName">
							</div>
							<div class="col-xs-3 bs-valid">
								<label for="groupName">用户组: </label>
								<span id="groupNameSpan">
									<select class="form-control select2"></select>
								</span>
							</div>
						</div>
					</div>
				</div>
				
				<table id="table"></table>
				
				<input type="hidden" name="orgCode" id="orgCode" />
				<input type="hidden" name="groupId" id="groupId" />
				<div id="treeDiv" class="treeDiv" style="display:none; position: absolute;">
					<ul id="treeUl" class="ztree" style="margin-top:0; width:160px;"></ul>
				</div>

<!-- 内容结束 -->
			</section>
		</div>
		<%@ include file="/WEB-INF/views/pagelet/footer.jsp"%>
	</div>
</body>

<script>
	$table = $('#table');
	$table.bootstrapTable({
		url : webroot + "/power/getdata",
		sortName: 'parent_resource_id asc,order_number',
        sortOrder: 'asc',
		method : "POST",
		pagination : true,
		sidePagination : "server",
		contentType: "application/x-www-form-urlencoded",
		queryParams: {
			groupId : ""
		},
		columns:[
			{
				title: '资源名称',
				field: 'resourceName'
			},{
				title: '资源类型',
				field: 'resourceTypeZh'
			},{
				title: '是否有权限',
				field: 'prower',
				visible: false
			},{
				title: '授权',
				field: 'resourceId',
				formatter : function(value,row,index){
					if(row.prower == "true"){
						return "<input type='checkbox' checked onclick='checkBoxClick(this)' value='" + value + "' />";
					} else {
						return "<input type='checkbox' onclick='checkBoxClick(this)' value='" + value + "' />";
					}
				}
			}]
	});
	$appTable.click($table,function(){
		$('#del').prop('disabled', !$appTable.getSelections($table).length);
		$('#update').prop('disabled', !$appTable.getSelections($table).length);
	});
	
	//机构树
	var setting = {
		view: {
			selectedMulti: false
		},
		async: {
			enable: true,
			url:"${webroot}/sysorg/getjsondata",
		},
		data: {
			simpleData: {
				enable: true
			}
		},
		callback: {
			onClick: onClickTree
		}
	};
	$.fn.zTree.init($("#treeUl"), setting);
	
	
	function checkBoxClick(obj){
		power(obj.checked,obj.value);
	}
	
	
	function power(flag,resourceId){
		$.ajax({
			type: "POST",
			url: webroot + "/power/modify?power=" + flag,
			data:{
				resourceId : resourceId,
				groupId : $("#groupId").val()
			},
			dataType: "json",
			success: function(resp){
				if(resp.success){
					
				} else {
					app.print.error(resp.message, null, null);
				}
			}
		});
	}
	
	
	function onClickTree(e, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeUl"),
		nodes = zTree.getSelectedNodes(),
		name = "";
		value = "";
		nodes.sort(function compare(a,b){return a.id-b.id;});
		for (var i=0, l=nodes.length; i<l; i++) {
			value += nodes[i].id + ",";
			name += nodes[i].name + ",";
		}
		if (value.length > 0 ) value = value.substring(0, value.length-1);
		if (name.length > 0 ) name = name.substring(0, name.length-1);
		
		$("#orgName").val(name);
		$("#orgCode").val(value);
		
		$.ajax({
			type: "POST",
			url: webroot + "/sysgroup/getdata",
			data:{
				orgCode : value
			},
			dataType: "json",
			success: function(resp){
				var html = "<select class=\"form-control select2\" onchange=\"loadGroup(this)\">";
				html += "<option>请选择</option>";
				var list = resp.rows;
				for(var i=0;i<list.length;i++){
					var sysGroup = list[i];
					html += "<option height=\"34\" value=\"" + sysGroup.id + "\">" + sysGroup.groupName + "</option>";
				}
				html += "</select>";
		 		$("#groupNameSpan").html(html);
			}
		});
		
		hideMenu();
	}
	
	
	function loadGroup(obj){
		var groupId = obj.value;
		$table.bootstrapTable('refreshOptions', {
			queryParams: {
				groupId : groupId
			}
        });
		$("#groupId").val(groupId);
	}

	
</script>

</html>
